<!DOCTYPE html>
<html>
<head>
    <title>订单记录</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, user-scalable=no, maximum-scale=1.0"/>
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <link href="{G_TEMPLATES_CSS}/wx/user.css" rel="stylesheet">
    <link href="{G_TEMPLATES_CSS}/wx/comm.css" rel="stylesheet">
    <script src="{G_TEMPLATES_JS}/wx/jquery-2.1.4.min.js"></script>
    <style>
       body{
          background-color:#F3F3F3;
      }	
  </style>
</head>
<body>
    <header class="header">
    	<a href="javascript:;" onClick="history.go(-1)">
    	<div class="header-left" style="margin-left:2%;">
    		<img src="{G_TEMPLATES_IMAGE}/wx/back-b.png" class="back">
            <span style="color:#fff;font-size:18px;float:left;display: inline-block;">我</span>
        </div>
        </a>
        <div class="header-center">
    		<span class="name">订单记录</span>
    	</div>
        <div class="header-right" style="float:right;width:15%;">
        	<img src="{G_TEMPLATES_IMAGE}/wx/zhuyejian.png" class="back">
        </div>
    </header>
    <div class="order-main">
       <ul>
           <li><span class="account-main-fl select">全部</span></li>
           <li><span class="account-main-fl">进行中</span></li>
           <li><span class="account-main-fl">已揭晓</span></li>
       </ul>
       <div class="clear"></div>
   </div>
   <!--进行中-->
   <div class="order-page">
       <ul>
       {wc:loop $startshoplist $startshoplist}
           <li>
               <a href="{WEB_PATH}/mobile/user/buyDetail/{wc:$startshoplist['shopid']}">
                   <img src="{G_UPLOAD_PATH}/{wc:$startshoplist['thumb']}" class="order-goods-img">
               </a>
               <a href="{WEB_PATH}/mobile/user/buyDetail/{wc:$startshoplist['shopid']}">
               <span class="order-goods-name">{wc:$startshoplist['shopname']}</span><br />
               <span class="order-state">进行中</span>
               <div class="bar-out"><div class="bar-in"></div></div>
               <div class="order-goods-num">
                   <ul>
                       <li>
                           <span class="font-red order-cy">{wc:$startshoplist['canyurenshu']}</span><br />
                           <span class="font-gray">已参与</span>
                       </li>
                       <li>
                           <span class="font-red order-zg">{wc:$startshoplist['zongrenshu']}</span><br />
                           <span class="font-gray">总参与人数</span>
                       </li>
                       <li>
                           <span class="font-red">{wc:$startshoplist['shenyurenshu']}</span><br />
                           <span class="font-gray">剩余</span>
                       </li>

                   </ul>
               </div>
               </a>
               {wc:loop:end}
           </li>

       </ul>
   </div>
</li>
</ul>
</div>
</li>
</ul>
</div>

<!--已揭晓-->
<div class="order-page">
	<ul>
    {wc:loop $endshoplist $endshoplist}
       <li>
           <a href="{WEB_PATH}/mobile/user/buyDetail/{wc:$endshoplist['shopid']}">
               <img src="{G_UPLOAD_PATH}/{wc:$endshoplist['thumb']}" class="order-goods-img">
           </a>
           <a href="{WEB_PATH}/mobile/user/buyDetail/{wc:$endshoplist['shopid']}">
           <span class="order-goods-name">{wc:$endshoplist['shopname']}</span><br />
           <span class="order-state-1">已揭晓</span><br />
           <span class="zj-num">中奖号码：{wc:$endshoplist['q_user_code']}</span><br />
           <span class="jx-time">揭晓时间：<?
                echo date("Y-m-d H:i",$endshoplist['q_end_time'])
                ?></span>
                 </a>
           <img src="{G_TEMPLATES_IMAGE}/wx/shanchu.png" class="order-del-img">
       </li>

       {wc:loop:end}
   </ul>
</div>


<script>
    $(document).ready(function(e) {
        $(".order-main ul li").click(function(){
          $(".account-main-fl").removeClass("select");
          var sw=$(".order-main ul li").index(this);
          $(".order-main ul li").eq(sw).children("span").addClass("select");
          if(sw==0){
             $(".order-page").show();
         }else{
             sw=sw-1;
             $(".order-page").eq(sw).show().siblings(".order-page").hide();
         }
     })
        $(".order-del-img").click(function(){
          if(confirm("确认删除吗")){
             alert("yes");
         }else{
             alert("no")
             return;
         }
     })
    });
</script>
<script>
    var len=$(".order-page>ul>li").length;
    var out=$(".bar-out").width();
    for(var i=0;i<len;i++)
    {
       var cy=$(".order-cy").eq(i).text();
       var cyNum=parseInt(cy);
       var zx=$(".order-zg").eq(i).text();
       var zxNum=parseInt(zx);
       var ra=cyNum/zxNum;
       var w=out*ra;
       $(".bar-in").eq(i).width(w);
   }
</script>
</body>
</html>
